Reggie! Themes
This page will explain how to create Reggie! Themes plug-ns. Minimally, themes define how in-editor objects are colored. They can also contain a custom icon set and change the UI style.
Index
Use the following links to navigate this page:
How Hard will it Be?
Getting Started: Creating main.XML
Setting Up main.xml
Adding Colors
Adding Icons
Changing the UI Style
Theme Color Reference
How Hard will it be?
Themes are the easiest type of Reggie! plug-in to create. You only need to work with one XML file unless you plan to add custom icons. Before starting, though, you need to know what XML files are and how to make them. If you're not familiar with that, Google it and then continue.
Getting Started: Creating main.xml
Firstly, every Reggie! theme must be located within reggiedata/themes. To create a new theme, make an empty XML file in that folder. You can name it anything as long as it ends with ".xml". Open it with any plain-text editor or XML editor.
Setting Up main.xml
After opening the file, add the following code:
<theme name="" version="1.0" creator="" description="">
</theme>
Now you need to fill in the empty attributes. Inside name="", insert the theme name. Add your username as the value of creator, and describe your theme in description.
Adding Colors
Now we need to add colors to the theme. Colors are defined between the <theme> and </theme> tags as <color /> tags. Here's the format of those:
To create a color tag, you need to know specifically which color you want to change. At the end of this page is a Theme Color Reference; use that to find valid IDs. IDs are case-insensitive, but the recommended capitalization is to use completely lower case letters.
After you've picked an ID, you need to decide on a new color to change it to. There are many ways of selecting an RGB (red-green-blue) color; Google it and find a website that lets you try different colors. Each value must be a decimal integer between 0 and 255. Once you have R, G, and B color values, you can decide on an A value. The A value determines the opacity of the color: a="255" would produce a fully opaque color whereas a="0" would produce a fully transparent color. Keep in mind that the A value is not required, but if you do not add it, Reggie! will use whatever A value the original color had.
You can add as many colors as you want, but please follow two guidelines:
- Don't repeat colors. There's no reason at all to do this. If you do, Reggie! will pick whichever color comes last.
- Don't add entries for colors that you have not changed. Colors that are not defined within your theme XML will automatically switch to the Classic theme. Try to keep the size of your theme XML down to a minimum by removing unnecessary data such as this.
Another thing you should know is that Reggie! can "guess" certain colors. You see, in the editor, certain colors are often identical. If you define one color in your theme but not another, Reggie! will assume that you want both of them to have the same value if they're usually identical. For example, if you define location_fill but not overview_location_fill, Reggie! will automatically set overview_location_fill to the new value of location_fill, rather than use the value defined by the Classic theme. In the Theme Color Reference at the bottom of this page, the "Defaults To..." column shows the color Reggie! will use if a color is not defined.
Adding Icons
In addition to colors, Reggie! themes also support custom icons. While you can change the entire icon set, most themes with custom icons only change a few. No matter how many icons you change, the process is the same. Follow the steps below if you would like to do this:
- The first step is to add the following attribute to the theme tag of your XML:
icons="True""True" is case-insensitive, but icons is not. It does not matter where you put the attribute, as long as it is in the <theme> tag.
- Next, you need to do create a folder to store your custom icons in. Here are the two requirements:
- The folder must be located in reggiedata/themes/
- The folder must be named XMLFileName_ico where XMLFileName is the filename of your XML file, without the .xml extention.
- Finally, you need to have some icons to put in that folder. Go to reggiedata/ico/ . All of Reggie's default icons are stored within that folder. If you would like to modify them in your theme, copy-and-paste some into your new XMLFileName_ico folder, and edit them with any image editor. Instead, you could also make icons from scratch or download some free ones from the Internet. In order for Reggie! to recognize them, though, they must have the exact same filename as the icon they are replacing in reggiedata/themes/ !
Changing the UI Style
Reggie! Themes can also change the UI style. This feature dramatically alters the feel of the editor. To edit the style, add the following attribute to the <theme> tag in your theme XML:
Add the name of a style between the quotes. Different operating systems support different styles, but here's a list of styles available on most computers:
- windows
- motif
- cde
- plastique
- cleanlooks
Theme Color Reference
The following table lists all valid theme color IDs and some basic information about each one. The R, G, B and A columns give the value of each color as it appears in the Classic theme. The "Defaults To..." column is explained at the end of the Adding Colors section above.
| ID | Description | R | G | B | A | Defaults to... |
|---|---|---|---|---|---|---|
| bg | Background Color | 119 | 136 | 153 | 255 | |
| comment_fill | Comments: Fill Color | 220 | 212 | 135 | 120 | |
| comment_fill_s | Comments: Fill Color when Selected | 254 | 240 | 240 | 240 | |
| comment_lines | Comments: Line Color | 192 | 192 | 192 | 120 | |
| comment_lines_s | Comments: Line Color when Selected | 220 | 212 | 135 | 240 | |
| entrance_fill | Entrances: Fill Color | 190 | 0 | 0 | 120 | |
| entrance_fill_s | Entrances: Fill Color when Selected | 190 | 0 | 0 | 240 | |
| entrance_lines | Entrances: Line Color | 0 | 0 | 0 | 255 | |
| entrance_lines_s | Entrances: Line Color when Selected | 255 | 255 | 255 | 255 | |
| grid | Grid Color | 255 | 255 | 255 | 100 | |
| mainmenu_buttons | Main Menu Buttons: Background Color | Default for the current style | ||||
| location_fill | Locations: Fill Color | 114 | 42 | 188 | 70 | |
| location_fill_s | Locations: Fill Color when Selected | 170 | 128 | 215 | 100 | |
| location_lines | Locations: Line Color | 0 | 0 | 0 | 255 | |
| location_lines_s | Locations: Line Color when Selected | 255 | 255 | 255 | 255 | |
| location_text | Locations: Location ID Text Color | 255 | 255 | 255 | 255 | |
| object_fill_s | Objects: Fill Color when Selected | 255 | 255 | 255 | 64 | |
| object_lines_s | Objects: Line Color when Selected | 255 | 255 | 255 | 255 | |
| overview_entrance | Overview: Entrance Fill Color | 255 | 0 | 0 | 255 | entrance_fill |
| overview_location_fill | Overview: Location Fill Color | 114 | 42 | 188 | 50 | location_fill |
| overview_location_lines | Overview: Location Lines Color | 0 | 0 | 0 | 255 | location_lines |
| overview_object | Overview: Object Fill Color | 255 | 255 | 255 | 255 | |
| overview_sprite | Overview: Sprite Fill Color | 0 | 92 | 196 | 255 | sprite_fill |
| overview_viewbox | Overview: "Current View" Rectangle Color | 0 | 0 | 255 | 255 | |
| overview_zone_fill | Overview: Zone Fill Color | 47 | 79 | 79 | 120 | |
| overview_zone_lines | Overview: Zone Lines Color | 0 | 255 | 255 | 255 | zone_lines |
| path_connector | Paths: Connecting Lines Color | 6 | 249 | 20 | 255 | |
| path_fill | Paths: Fill Color | 6 | 249 | 20 | 120 | |
| path_fill_s | Paths: Fill Color when Selected | 6 | 249 | 20 | 240 | |
| path_lines | Paths: Line Color | 0 | 0 | 0 | 255 | |
| path_lines_s | Paths: Line Color when Selected | 255 | 255 | 255 | 255 | |
| ribbon | Ribbon: Accent Color | 205 | 205 | 255 | 255 | |
| smi | Sprite Movement Indicator* | 255 | 255 | 255 | 80 | |
| sprite_fill_s | Sprite Images: Fill Color when Selected | 255 | 255 | 255 | 64 | |
| sprite_lines_s | Sprite Images: Line Color when Selected | 255 | 255 | 255 | 255 | |
| spritebox_fill | Sprites: Fill Color | 0 | 92 | 196 | 120 | |
| spritebox_fill_s | Sprites: Fill Color when Selected | 0 | 92 | 196 | 240 | |
| spritebox_lines | Sprites: Line Color | 0 | 0 | 0 | 255 | |
| spritebox_lines_s | Sprites: Line Color | 255 | 255 | 255 | 255 | |
| ui | User Interface Color | Default for the current style | ||||
| watermark | Main Menu: Watermark Color | 0 | 0 | 0 | 36 | |
| zone_lines | Zones: Line Color | 145 | 200 | 255 | 176 | |
| zone_corner | Zones: Corner Color | 255 | 255 | 255 | 255 | |
| zone_dark_fill | Zones: Fill Color when Darkness is Enabled | 0 | 0 | 0 | 48 | |
| zone_text | Zones: Zone ID Text Color | 44 | 64 | 84 | 255 | |
*See sprites 96 and 212 for examples of this.
